<template>
  <a-modal :width="450" title="修改密码" v-model="visible" :confirmLoading="loading" :maskClosable="false" @ok="onSubmit">
    <a-spin :delay="100" :spinning="loading">
      <a-form :form="form" :label-col="{ span: 5 }" :wrapper-col="{ span: 17 }" @submit.stop="onSubmit">
        <a-form-item label="登陆密码">
          <a-input-password placeholder="请输入登陆密码" :maxLength="50" autocomplete="off" v-decorator="verify.pwd" />
        </a-form-item>
        <a-form-item label="新密码">
          <a-input-password placeholder="请输入新密码" :maxLength="50" autocomplete="off" v-decorator="verify.password" />
        </a-form-item>
        <a-form-item label="确定密码">
          <a-input-password placeholder="确定新密码" :maxLength="50" autocomplete="off" v-decorator="verify.confirm" />
        </a-form-item>
        <a-button html-type="submit" v-show="false" />
      </a-form>
    </a-spin>
  </a-modal>
</template>

<script>
// import { ChangePwd } from '@/api/leader'
export default {
  name: 'ResetPwd', //修改密码(重置密码)
  data() {
    return {
      visible: false,
      loading: false,
      form: this.$form.createForm(this),
      verify: {
        pwd: ['pwd', { rules: [{ required: true, whitespace: true, message: '请输入登陆密码' }] }],
        password: [
          'npwd',
          {
            validateFirst: true,
            validateTrigger: 'blur',
            rules: [
              { required: true, whitespace: true, message: '请输入新密码' },
              { min: 6, message: '密码最少设置6位' }
            ]
          }
        ],
        confirm: [
          'pwdok',
          {
            validateFirst: true,
            validateTrigger: 'blur',
            rules: [
              { required: true, whitespace: true, message: '请确定新密码' },
              { min: 6, message: '密码最少设置6位' },
              {
                validator: (rule, value, callback) => {
                  const form = this.form
                  if (value && value !== form.getFieldValue('npwd')) {
                    callback('两次密码不一致')
                  } else callback()
                }
              }
            ]
          }
        ]
      }
    }
  },
  methods: {
    open() {
      this.form?.resetFields()
      this.visible = true
    },
    onSubmit(e) {
      e.preventDefault()
      const { form, $message } = this
      form.validateFields((errors, values) => {
        if (!errors) {
          this.loading = true
          $message.success(values)
          // ChangePwd(values)
          //   .then(res => {
          //     this.visible = false
          //   })
          //   .catch(err => {
          //     $message.error(err)
          //   })
          //   .finally(() => {
          //     this.loading = false
          //   })
        }
      })
    }
  }
}
</script>
